//查询总操作量，网站访问记录数，pv
$.ajax({
	method: "POST",
	url: "findPV",
	success: function (data) {
		console.log(data);
		$("#pv").text(data)
	}
});

//用户人数前三的区域
$.ajax({
	method: "POST",
	url: "proUsersTop3_2",
	success: function (data) {
		var jsonArrr = JSON.parse(data);
		$.each(jsonArrr, function (index, proUser) {
			$("#pro_user span:eq("+index+")").text(proUser.province + ":" + proUser.count);
		});
	}
});

function fnW(str) {
	var num;
	str >= 10 ? (num = str) : (num = '0' + str);
	return num;
}


//中国地图开始
$.ajax({
	method: "POST",
	url: "proTotalCount_2",
	success: function (data) {
		//转换为json数组
		var jsonArr = JSON.parse(data);

		var parchaseData = [];

		$.each(jsonArr, function (index, proTotalCount) {
			var pro = proTotalCount.province;
			pro = pro.replaceAll("省", "");
			pro = pro.replaceAll("市", "");
			pro = pro.replaceAll("自治区", "");
			pro = pro.replaceAll("特别行政区", "");
			if (pro.length > 3) {
				pro = pro.substring(0, 2);
			}
			parchaseData.push({name: pro, value: proTotalCount.parchaseCount});
		});


		var china_map = echarts.init(document.getElementById('china_map'), 'infographic');
		var option = {
			//backgroundColor: '#FFFFFF',

			title: {
				text: '各地区销量统计',
				textStyle: { color: '#fff' },
				x: 'center'
			},
			tooltip: {
				trigger: 'item'
			},
			visualMap: {
				show: false,
				x: 'left',
				y: 'bottom',
				//layoutCenter:['30%','30%'],
				splitList: [
					{ start: 24000, end: 27000 },
					{ start: 21000, end: 24000 },
					{ start: 19000, end: 21000 },
					{ start: 16000, end: 19000 },
					{ start: 13000, end: 16000 },
					{ start: 10000, end: 13000 }
				],
				color: ['#FF0000', '#ffff00', '#0E94EB', '#6FBCF0', '#F0F06F', '#00CC00']
			},
			series: [
				{
					name: '各地区销量',
					type: 'map',
					mapType: 'china',
					roam: true,
					label: {
						normal: {
							show: false
						},
						emphasis: {
							show: false
						}
					},
					data: parchaseData
				}
			]
		};

		china_map.setOption(option);
	}
});
//中国地图结束


//获取当前时间
var timer = setInterval(function () {
	var date = new Date();
	var year = date.getFullYear(); //当前年份
	var month = date.getMonth(); //当前月份
	var data = date.getDate(); //天
	var hours = date.getHours(); //小时
	var minute = date.getMinutes(); //分
	var second = date.getSeconds(); //秒
	var day = date.getDay(); //获取当前星期几
	var ampm = hours < 12 ? 'am' : 'pm';
	$('#time').html(fnW(hours) + ':' + fnW(minute) + ':' + fnW(second));
	$('#date').html('<span>' + year + '/' + (month + 1) + '/' + data + '</span><span>' + ampm + '</span><span>周' + day + '</span>');
}, 1000);

// !======================系统男女比例开始======================
//var pie_fanzui =echarts.init(document.getElementById("pie_fanzui"),'macarons');
$.ajax({
	method: "POST",
	url: "findSexUserCount",
	success: function (data) {
		console.log(data);
		var jsonArr = JSON.parse(data);
		var datas = [];
		$.each(jsonArr, function (index, sexCount) {
			datas.push({ value: sexCount.userCount, name: sexCount.sex });
		});
		var pie_fanzui = echarts.init(document.getElementById('pie_fanzui'), 'infographic');
		option = {
			title: {
				x: 'center'
			},
			tooltip: {
				trigger: 'item',
				formatter: '{a} <br/>{b} : {c} ({d}%)'
			},
			legend: {
				orient: 'vertical',
				left: 'left',
				data: ['男性', '女性'],
				textStyle: { color: '#fff' }
			},

			label: {
				normal: {
					textStyle: {
						color: 'red' // 改变标示文字的颜色
					}
				}
			},
			series: [
				{
					name: '系统男女比例',
					type: 'pie',
					radius: '55%',
					center: ['50%', '50%'],
					data: datas,
					itemStyle: {
						emphasis: {
							shadowBlur: 10,
							shadowOffsetX: 0,
							shadowColor: 'rgba(0, 0, 0, 0.5)'
						}
					}
				}
			]
		};
		pie_fanzui.setOption(option);
// !======================系统男女比例结束======================
	}
});



// !======================不同年龄阶段消费占比，带边框效果的饼图开始======================
$.ajax({
	method: "POST",
	url: "earParcaseCount_2",
	success: function (data) {
		var jsonArr = JSON.parse(data);
		var all_data = [];
		$.each(jsonArr, function (index, parcharseCount) {
			all_data.push(
				{
					value: parcharseCount.count,
					name: parcharseCount.era + "后"
				}
			)
		});
		var pie_age = echarts.init(document.getElementById('pie_age'), 'infographic');
		option = {
			tooltip: {
				trigger: 'item',
				formatter: '{a} <br/>{b}: {c} ({d}%)'
			},
			legend: {
				// orient: 'vertical',
				// x: 'left',
				bottom: 10,
				// data: ['18-30', '31-40', '41-50', '51-60', '65岁以上', '未标明'],
				// data: ['10后', '00后', '90后', '80后', '70后', '60后', '未知'],
				textStyle: { color: '#fff' }
			},
			series: [
				{
					name: '不同年龄阶段消费占比',
					type: 'pie',
					radius: ['40%', '55%'],
					center: ['50%', '40%'],
					avoidLabelOverlap: false,
					label: {
						normal: {
							show: false,
							position: 'center'
						},
						emphasis: {
							show: true,
							textStyle: {
								fontSize: '20',
								fontWeight: 'bold'
							}
						}
					},
					labelLine: {
						normal: {
							show: false
						}
					},
					data: all_data
				}
			]
		};
		pie_age.setOption(option);
	}
});
// !======================不同年龄阶段消费占比，带边框效果的饼图结束======================

//===================不同时间段浏览量=======================
$.ajax({
	method: "POST",
	url: "timeAllCount_2",
	success: function (data) {
		var jsonArr = JSON.parse(data);
		var x_data = [];
		var y_data = [];
		$.each(jsonArr, function (index, timeCount) {
			x_data.push(timeCount.hour);
			y_data.push(timeCount.viewCount);
		});
		var line_time = echarts.init(document.getElementById('line_time'), 'macarons');

		var option = {
			// 给echarts图设置背景色
			//backgroundColor: '#FBFBFB',  // -----------> // 给echarts图设置背景色
			color: ['#7FFF00'],
			tooltip: {
				trigger: 'axis'
			},

			grid: {
				x: 50,
				y: 30,
				x2: 5,
				y2: 20
			},
			calculable: true,

			xAxis: [
				{
					name: "小时",
					type: 'category',
					data: x_data,
					axisLabel: {
						color: '#7FFF00' //刻度线标签颜色
					}
				}
			],
			yAxis: [
				{
					min: 27000,
					max: 28500,
					splitNumber: 6,
					type: 'value',
					axisLabel: {
						color: '#7FFF00' //刻度线标签颜色
					}
				}
			],
			series: [
				{
					name: '浏览量',
					type: 'line',
					data: y_data
				}
			]
		};

		line_time.setOption(option);
	}
});

// !=========销量top10的类目=======================
$.ajax({
	method: "POST",
	url: "cateParTop10_2",
	success: function (data) {
		var jsonArr = JSON.parse(data);
		var x_data = [];
		var y_data = [];
		$.each(jsonArr, function (index, catePar) {
			x_data.push(catePar.cname);
			y_data.push(catePar.count);
		});
		var qufenbu_data = echarts.init(document.getElementById('qufenbu_data1'), 'infographic');

		option = {
			color: ['#FADB71'],
			tooltip: {
				trigger: 'axis',
				axisPointer: {
					// 坐标轴指示器，坐标轴触发有效
					type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
				}
			},
			grid: {
				x: 55,
				y: 10,
				x2: 5,
				y2: 20
			},
			xAxis: [
				{
					type: 'value',
					axisLabel: {
						color: '#FADB71', //刻度线标签颜色
						width: 300
					}
				}
			],
			yAxis: [
				{
					type: 'category',
					data: x_data,
					axisTick: {
						alignWithLabel: true
					},
					axisLabel: {
						color: '#FADB71', //刻度线标签颜色
						// margin: -20
						width: 900,
						overflow: 'break',

						rich: {
							flag: {
								// fontSize: 25,
								padding: 50
								// width: 300
							}
						}
					}
				}
			],
			series: [
				{
					name: '销量',
					type: 'bar',
					barWidth: '60%',
					data: y_data
				}
			]
		};

		qufenbu_data.setOption(option);
	}
});
// !=========销量前十的类目=======================

//=========销量前十的区域=======================
$.ajax({
	method: "POST",
	url: "proTotalCount_21",
	success: function (data) {
		var jsonArr = JSON.parse(data);
		var x_data = [];
		var y_data = [];
		$.each(jsonArr, function (index, proTotal) {
			var pro = proTotal.province;
			pro = pro.replaceAll("省", "");
			pro = pro.replaceAll("市", "");
			pro = pro.replaceAll("壮族", "");
			pro = pro.replaceAll("自治区", "");
			x_data.push(pro);
			y_data.push(proTotal.parchaseCount);
		});
		console.log(x_data);
		var qufenbu_data = echarts.init(document.getElementById('qufenbu_data'), 'infographic');
		var option = {
			color: ['#FADB71'],
			tooltip: {
				trigger: 'axis',
				axisPointer: {
					// 坐标轴指示器，坐标轴触发有效
					type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
				}
			},
			grid: {
				x: 50,
				y: 25,
				x2: 15,
				y2: 40
			},
			xAxis: [
				{
					type: 'category',
					data: x_data,
					axisTick: {
						alignWithLabel: true
					},
					axisLabel: {
						color: '#FADB71', //刻度线标签颜色
						rotate: -45,
					}
				}
			],
			yAxis: [
				{
					type: 'value',
					axisLabel: {
						color: '#FADB71' //刻度线标签颜色
					}
				}
			],
			series: [
				{
					name: '地区分布',
					type: 'bar',
					barWidth: '60%',
					data: y_data
				}
			]
		};

		qufenbu_data.setOption(option);
	}
});
//=========销量前十的区域=======================

//时间选择器
var startV = '';
var endV = '';
laydate.skin('danlan');
var startTime = {
	elem: '#startTime',
	format: 'YYYY-MM-DD',
	min: '1997-01-01', //设定最小日期为当前日期
	max: laydate.now(), //最大日期
	istime: true,
	istoday: true,
	fixed: false,
	choose: function (datas) {
		startV = datas;
		endTime.min = datas; //开始日选好后，重置结束日的最小日期
	}
};
var endTime = {
	elem: '#endTime',
	format: 'YYYY-MM-DD',
	min: laydate.now(),
	max: laydate.now(),
	istime: true,
	istoday: true,
	fixed: false,
	choose: function (datas) {
		//        startTime.max = datas; //结束日选好后，重置开始日的最大日期
		endV = datas;
	}
};

laydate(startTime);
laydate(endTime);

//时间选择器
var startVs = '';
var endVs = '';
laydate.skin('danlan');
var startTimes = {
	elem: '#startTimes',
	format: 'YYYY-MM-DD',
	min: '1997-01-01', //设定最小日期为当前日期
	max: '2099-06-16', //最大日期
	istime: true,
	istoday: true,
	fixed: false,
	choose: function (datas) {
		startVs = datas;
		endTimes.min = datas; //开始日选好后，重置结束日的最小日期
		setQgData($('#barTypes').parent().parent(), 1);
	}
};
var endTimes = {
	elem: '#endTimes',
	format: 'YYYY-MM-DD',
	min: laydate.now(),
	max: laydate.now(),
	istime: true,
	istoday: true,
	fixed: false,
	choose: function (datas) {
		//        startTime.max = datas; //结束日选好后，重置开始日的最大日期
		endVs = datas;
		setQgData($('#barTypes').parent().parent(), 1);
	}
};

laydate(startTimes);
laydate(endTimes);

//更改日期插件的样式
function dateCss() {
	var arr = $('#laydate_box').attr('style').split(';');
	var cssStr = 'position:absolute;right:0;';
	for (var i = 0; i < arr.length; i++) {
		if (arr[i].indexOf('top') != -1) {
			cssStr += arr[i];
		}
	}

	$('#laydate_box').attr('style', cssStr);
}

var workDate;
var time = {
	elem: '#times',
	format: 'YYYY-MM-DD',
	min: laydate.now(),
	max: laydate.now() + 30,
	istime: true,
	istoday: true,
	fixed: false,
	choose: function (datas) {
		//        startTime.max = datas; //结束日选好后，重置开始日的最大日期
		workDate = datas;
	}
};

laydate(time);
